<template>
  <view class="open-map-btn inline-block">
    <view class="inline-block" @click="chooseMap">
      <slot>
        <button type="primary">地图导航</button>
      </slot>
    </view>
    <u-action-sheet
      :actions="actions"
      safeAreaInsetBottom
      :show="show"
      cancelText="取消"
      @close="onCancel"
      @select="select">
    </u-action-sheet>
  </view>
</template>
<script>
import { openMap } from '@/utils/jssdk';
import { openAppMap } from '@/utils/map';
import { isMini } from '@/utils/plantForm';

export default {
  props: {
    address: {
      type: Object,
      default: () => {
        return {

        };
      }
    }
  },
  computed: {

  },
  data() {
    return {
      show: false,
      actions: [
        // 参数 自研app有用，等app开发完修改
        { name: '高德地图', value: 1, map: 'com.autonavi.minimap', mapios: 'iosamap://' },
        { name: '腾讯地图', value: 2, map: 'com.tencent.map', mapios: 'qqmap://' },
        { name: '百度地图', value: 3, map: 'com.baidu.BaiduMap', mapios: 'baidumap://' }
      ]
    };
  },
  methods: {
    chooseMap() {
      if (isMini) {
        openMap(this.address);
      } else {
        this.show = true;
      }
    },
    select({ value }) {
      console.log(value);
      // 项目地图坐标均用百度坐标 121.560475,29.875832
      const { lng, lat } = this.address;
      openAppMap(value, { lng, lat });
    },
    onCancel() {
      this.show = false;
    }
  },
  created() {

  }
};
</script>
<style scoped>
 .open-map-btn {

 }
 .inline-block {
  display: inline-block;
  /*  */
 }
</style>
